﻿
.bg1banner { margin: 0px auto; width: 100%; background-color: #f7f7f7; }
    .bg1banner .slideBox { overflow: hidden; zoom: 1; position: relative; }
        .bg1banner .slideBox .hd { height: 15px; overflow: hidden; position: absolute; bottom: 30px; z-index: 1; text-align: center; left: 0px; right: 0px; }
            .bg1banner .slideBox .hd ul { overflow: hidden; zoom: 1; font-size: 0px; vertical-align: top; margin: 0px auto; }
                .bg1banner .slideBox .hd ul li { display: inline-block; margin: 0px 10px; width: 46px; height: 5px; border-radius: 2px; line-height: 5px; text-align: center; border: solid 1px #fff; cursor: pointer; }
                    .bg1banner .slideBox .hd ul li.on { background-color: #ff0000; border: solid 1px #f47c75; }

        .bg1banner .slideBox .bd ul { margin: 0px auto; overflow: hidden; }
            .bg1banner .slideBox .bd ul li { width: 100%; float: left; position: relative; }
                .bg1banner .slideBox .bd ul li img { display: inline-block; height: 100%; width: 100%; max-width: 1920px; text-align: center; }


        .bg1banner .slideBox .prev, .bg1banner .slideBox .next { display: none; }


@media only screen and (max-width:768px) {
    .bg1banner .slideBox .hd { bottom: 20px; }
    .bg1banner .slideBox .prev, .bg1banner .slideBox .next { display: block; position: absolute; width: 27px; height: 50px; float: left; margin-left: 3%; top: calc(50% - 27px); }
    .bg1banner .slideBox .next { right: 0px; margin-right: 3% }
    .bg1banner .slideBox .hd { display: none; }
}


.mainbusiness { width: 100%; background-color: #f7f7f7; }
    .mainbusiness .conn { max-width: 1240px; margin: 0px auto; }
        .mainbusiness .conn h3 { padding-top: 46px; line-height: 1.5; font-size: 30px; color: #333333; font-weight: 400; }
        .mainbusiness .conn i { font-size: 16px; color: #bdbdbd; font-style: normal; text-transform: uppercase }
        .mainbusiness .conn ul { width: 100%; font-size: 0px; margin-top: 30px; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s; }
            .mainbusiness .conn ul li { border: solid 1px #d4d4d4; background-color: #fff; vertical-align: top; display: inline-block; width: 18%; margin: 0px 1%; padding: 0px 20px; }
                .mainbusiness .conn ul li .item { width: 100%; padding: 35px 5px 20px 5px; text-align: center; }
                    .mainbusiness .conn ul li .item h2 { font-size: 24px; color: #333; font-weight: 400; line-height: 1.5; }
                    .mainbusiness .conn ul li .item i { text-transform: uppercase; font-size: 14px; }
                .mainbusiness .conn ul li:hover { box-shadow: 0px 0px 25px #d1d1d1; border: solid 1px #d4d4d4; }


@media only screen and (max-width:1024px) {
    .mainbusiness .conn h3 { padding-top: 36px; font-size: 24px; line-height: 1.5; }
    .mainbusiness .conn i { font-size: 14px; }
    .mainbusiness .conn ul li .item h2 { font-size: 16px; }
    .mainbusiness .conn ul li .item i { font-size: 12px; }
}

@media only screen and (max-width:768px) {
    .mainbusiness .conn h3 { padding-top: 20px; font-size: 18px; line-height: 1.5; }
    .mainbusiness .conn i { font-size: 12px; }
    .mainbusiness .conn ul li { padding: 0px 10px; }
        .mainbusiness .conn ul li .item h2 { font-size: 14px; }
        .mainbusiness .conn ul li .item i { font-size: 12px; }
}


@media only screen and (max-width:640px) {
    .mainbusiness .conn h3 { padding-top: 20px; font-size: 18px; line-height: 1.5; }
    .mainbusiness .conn i { font-size: 12px; }
    .mainbusiness .conn ul { display: block; padding: 0px 10px; }
        .mainbusiness .conn ul li { padding: 0px 10px; margin: 0px; width: 100%; margin-bottom: 10px; }
            .mainbusiness .conn ul li .item { padding: 20px 5px 5px 10px; }
                .mainbusiness .conn ul li .item h2 { font-size: 14px; }
                .mainbusiness .conn ul li .item i { font-size: 12px; }
}



.productslist { width: 100%; background-color: #f7f7f7; padding-bottom: 50px; }
    .productslist .conn { max-width: 1240px; margin: 0px auto; }
        .productslist .conn h3 { padding-top: 46px; line-height: 1.5; font-size: 30px; color: #333333; font-weight: 400; }
        .productslist .conn i { font-size: 16px; color: #bdbdbd; font-style: normal; text-transform: uppercase }

        .productslist .conn .content { max-width: 1200px; margin-top: 30px; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; }
            .productslist .conn .content .lt { width: 32%; float: left; text-align: left; position: relative; border: solid 0px #000; }
                .productslist .conn .content .lt .box { padding: 30px 20px 20px 20px; border: solid 1px #d4d4d4; vertical-align: top; position: absolute; right: 0px; left: 0px; bottom: 100px; top: 0px; }
                .productslist .conn .content .lt .img { position: absolute; margin-left: 20px; bottom: 10px; left: 0px; right: -20px; }
                    .productslist .conn .content .lt .img img { max-width: 388px; width: 100%; }

                .productslist .conn .content .lt .box h3 { padding-top: 0px; font-size: 24px; color: #333; border: solid 0px #000; line-height: 1.5; font-weight: 400; }
                
                .productslist .conn .content .lt .box i { font-size: 14px; color: #bdbdbd; font-style: normal; text-transform: uppercase }
                .productslist .conn .content .lt .box .line { height: 20px; width: 150px; background-color: #830010; position: absolute; right: -20px; top: 60px; }


            .productslist .conn .content .rt { width: 68%; padding-left: 40px; float: left; text-align: left; }
                .productslist .conn .content .rt ul { width: 100%; }
                    .productslist .conn .content .rt ul li { width: 50%; float: left; padding: 0px 10px 10px 0px;   }
                        .productslist .conn .content .rt ul li .picx { width: 100%; overflow: hidden; }
                        .productslist .conn .content .rt ul li img { max-width: 376px; width: 100%; display: inline-block; height: 100%; width: 100%; max-width: 400px; text-align: center; -webkit-transform: scale(1,1); -ms-transform: scale(1,1); transform: scale(1,1); display: block; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s; }

                        .productslist .conn .content .rt ul li:hover img { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); display: block; }




@media only screen and (max-width:960px) {
    .productslist .conn .content .lt .box { padding: 10px 20px 20px 20px; }
        .productslist .conn .content .lt .box h3 { font-size: 16px; }
        .productslist .conn .content .lt .box i { font-size: 12px; }
        .productslist .conn .content .lt .box .line { display: none; }
}


@media only screen and (max-width:768px) {
    .productslist .conn h3 { padding-top: 20px; font-size: 18px; }
    .productslist .conn i { font-size: 12px; }

    .productslist .conn .content { margin-top: 20px; display: block; overflow: hidden; }
        .productslist .conn .content .lt { width: 100%; }
            .productslist .conn .content .lt .box { padding: 0px 20px 20px 20px; position: inherit; text-align: center; width: 100%; border-style: none; }
                .productslist .conn .content .lt .box h3 { font-size: 14px; text-align: center; }
                .productslist .conn .content .lt .box i { font-size: 12px; text-align: center; }
            .productslist .conn .content .lt .img { display: none; position: inherit; margin-left: 0px; }
                .productslist .conn .content .lt .img img { width: 100%; max-width: 100%; }
        .productslist .conn .content .rt { padding-left: 0px; padding-right: 0px; width: 100%; }
            .productslist .conn .content .rt ul li { padding: 10px }
}

.ouradvantages { width: 100%; background-color: #eeeeee; }
    .ouradvantages .conn { max-width: 1200px; margin: 0px auto; }
        .ouradvantages .conn h3 { padding-top: 46px; line-height: 1.5; font-size: 30px; color: #333333; font-weight: 400; }
        .ouradvantages .conn i { font-size: 16px; color: #bdbdbd; font-style: normal; text-transform: uppercase }
        .ouradvantages .conn .content { margin-top: 60px; padding-bottom: 60px; }
            .ouradvantages .conn .content img { max-width: 100%; }

@media only screen and (max-width:1024px) {
    .ouradvantages .conn h3 { padding-top: 36px; font-size: 24px; line-height: 1.5; }
    .ouradvantages .conn i { font-size: 14px; }
}

@media only screen and (max-width:768px) {
    .ouradvantages .conn h3 { padding-top: 20px; font-size: 18px; line-height: 1.5; }
    .ouradvantages .conn i { font-size: 12px; }
    .ouradvantages .conn .content { margin-top: 30px; padding-bottom: 30px; }
}



.caselist { width: 100%; background-color: #eeeeee; background-image: url(/Tpl/ID1013/images/home/p5.jpg); background-repeat: repeat-x; }
    .caselist .conn { max-width: 1200px; margin: 0px auto; }
        .caselist .conn h3 { padding-top: 46px; line-height: 1.5; font-size: 30px; color: #fff; font-weight: 400; }
        .caselist .conn i { font-size: 16px; color: #fff; font-style: normal; text-transform: uppercase }
        .caselist .conn .content { padding-top: 60px; padding-bottom: 60px; }


@media only screen and (max-width:1024px) {
    .caselist .conn h3 { padding-top: 36px; font-size: 24px; line-height: 1.5; }
    .caselist .conn i { font-size: 14px; }
}

@media only screen and (max-width:768px) {
    .caselist .conn h3 { padding-top: 20px; font-size: 18px; line-height: 1.5; }
    .caselist .conn i { font-size: 12px; }
    .caselist .conn .content { padding-top: 30px; padding-bottom: 30px; }
}





.casebanner { margin: 0px auto; max-width: 950px; width: 100%; }
    .casebanner .slideBox { overflow: hidden; zoom: 1; position: relative; }
        .casebanner .slideBox .hd { margin-top: 30px; height: 20px; overflow: hidden; bottom: 0px; z-index: 1; text-align: center; left: 0px; right: 0px; }
            .casebanner .slideBox .hd ul { overflow: hidden; zoom: 1; font-size: 0px; vertical-align: top; margin: 0px auto; }
                .casebanner .slideBox .hd ul li { display: inline-block; margin: 0px 10px; width: 18px; height: 18px; border-radius: 9px; text-align: center; border: solid 1px #f3f2f2; cursor: pointer; }
                    .casebanner .slideBox .hd ul li.on { background-color: #f3f2f2; border: solid 1px #f3f2f2; }

        .casebanner .slideBox .bd ul { width: 100%; overflow: hidden; position: relative; height: 180px; }
            .casebanner .slideBox .bd ul li { border: solid 0px #fff; width: 100%; float: left; position: relative; font-size: 16px; color: #fff; }

                .casebanner .slideBox .bd ul li .item { width: 100%; overflow: hidden; }
                    .casebanner .slideBox .bd ul li .item .img { float: left; width: 230px; }
                        .casebanner .slideBox .bd ul li .item .img img { max-width: 100%; }
                    .casebanner .slideBox .bd ul li .item .text { margin-left: 255px; vertical-align: top; text-align: left; }
                        .casebanner .slideBox .bd ul li .item .text h3 { display: block; border-bottom: solid 1px #666; line-height: 1.8; padding-top: 0px; font-size: 26px; color: #fefefe; font-weight: 400; }
                        .casebanner .slideBox .bd ul li .item .text p { color: #d4d4d4; font-size: 16px; line-height: 1.8; }

@media only screen and (max-width:768px) {
    .casebanner .slideBox .hd { margin-top: 20px; }
    .casebanner .slideBox .bd ul li .item { padding: 0px 10px; }
        .casebanner .slideBox .bd ul li .item .img { width: 150px; }
        .casebanner .slideBox .bd ul li .item .text { margin-left: 165px; }
            .casebanner .slideBox .bd ul li .item .text h3 { font-size: 16px; }
            .casebanner .slideBox .bd ul li .item .text p { font-size: 14px; }
}



.newslist { width: 100%; background-color: #f7f7f7; }
    .newslist .conn { max-width: 1246px; margin: 0px auto; }
        .newslist .conn h3 { padding-top: 46px; line-height: 1.5; font-size: 30px; color: #333333; font-weight: 400; }
        .newslist .conn i { font-size: 16px; color: #bdbdbd; font-style: normal; text-transform: uppercase }
        .newslist .conn .content { padding-top: 60px; padding-bottom: 60px; }


@media only screen and (max-width:1024px) {
    .newslist .conn h3 { padding-top: 36px; font-size: 24px; line-height: 1.5; }
    .newslist .conn i { font-size: 14px; }
}

@media only screen and (max-width:768px) {
    .newslist .conn h3 { padding-top: 20px; font-size: 18px; line-height: 1.5; }
    .newslist .conn i { font-size: 12px; }
    .newslist .conn .content { padding-top: 30px; padding-bottom: 30px; }
}

.newsul { width: 100%; font-size: 0px; }
    .newsul li { display: inline-block; width: 33.33%; padding: 0px 23px; vertical-align: top; }
        .newsul li dl { width: 100%; }
            .newsul li dl dt { width: 100%; text-align: left; font-size: 0px; color: #333; border-bottom: solid 1px #e5e5e5; padding-bottom: 5px; }
                .newsul li dl dt b { display: inline-block; margin-right: 10px; width: 6px; height: 24px; background-color: #c72126; font-weight: 400; vertical-align: middle; }
                .newsul li dl dt span { font-size: 24px; margin-right: 6px; color: #333; line-height: 1; vertical-align: middle; }
                .newsul li dl dt i { font-size: 20px; color: #999; vertical-align: middle; }
            .newsul li dl dd { width: 100%; }
                .newsul li dl dd img { margin-top: 20px; max-width: 100%; }
                .newsul li dl dd a { line-height: 2; display: block; width: 100%; text-align: left; font-size: 16px; border-bottom: dashed 1px #d4d4d4; color: #666; }
                    .newsul li dl dd a i { width: 8px; height: 8px; display: inline-block; background-color: #c72126; vertical-align: middle; margin-right: 10px; }
                    .newsul li dl dd a:hover { color: #c72126 }


                    @media only screen and (max-width:960px) { .newsul li { padding: 0px 10px; }
        .newsul li dl dt b { height: 18px; }
        .newsul li dl dt span { font-size: 18px; }
        .newsul li dl dt i { font-size: 14px; }
        .newsul li dl dd img { margin-top: 10px; }
        .newsul li dl dd a { font-size: 14px; }
}

@media only screen and (max-width:768px) {
    .newsul li { width: 100%; padding: 0px 10px; margin-bottom: 20px; }
        .newsul li dl dt span { font-size: 16px; }
        .newsul li dl dt i { font-size: 14px; }
        .newsul li dl dd img { margin-top: 10px; }
}




.bandlist { width: 100%; background-color: #f7f7f7; }
    .bandlist .conn { max-width: 1218px; margin: 0px auto; }
        .bandlist .conn h3 { line-height: 1.5; font-size: 30px; color: #333333; font-weight: 400; }
        .bandlist .conn i { font-size: 16px; color: #bdbdbd; font-style: normal; text-transform: uppercase }
        .bandlist .conn .content { padding-top: 30px; padding-bottom: 30px; }

            .bandlist .conn .content ul { width: 100%; font-size: 0px; text-align: left; }
                .bandlist .conn .content ul li { display: inline-block; width: 16.66%; padding: 9px 9px; }
                    .bandlist .conn .content ul li img { max-width: 100%; border: solid 1px #ccc; }

@media only screen and (max-width:1024px) {
    .bandlist .conn h3 { font-size: 24px; line-height: 1.5; }
    .bandlist .conn i { font-size: 14px; }
}

@media only screen and (max-width:768px) {
    .bandlist .conn h3 { font-size: 18px; line-height: 1.5; }
    .bandlist .conn i { font-size: 12px; }
    .bandlist .conn .content { padding-top: 30px; padding-bottom: 30px; }
        .bandlist .conn .content ul li { width: 33.33%; }
}



.olinelist { width: 100%; background-color: #fff; }
    .olinelist .conn { max-width: 1218px; margin: 0px auto; }
        .olinelist .conn h3 { padding-top: 46px; line-height: 1.5; font-size: 30px; color: #333333; font-weight: 400; }
        .olinelist .conn i { font-size: 16px; color: #bdbdbd; font-style: normal; text-transform: uppercase }
        .olinelist .conn .content { padding-top: 30px; padding-bottom: 30px; }

            .olinelist .conn .content ul { overflow: hidden; width: 100%; }
                .olinelist .conn .content ul li { font-size: 16px; width: 46%; margin-left: 2%; margin-right: 2%; float: left; text-align: left; line-height: 30px; color: #181818; margin-bottom: 10px; }
                    .olinelist .conn .content ul li b { font-weight: 400; color: #4f4f4f; }
                    .olinelist .conn .content ul li.txt { width: 96%; }
                    .olinelist .conn .content ul li.bom { width: 96%; margin-top: 10px; text-align: center; }

    .olinelist .sps { background-color: #f7f7f7; height: 50px; }

@media only screen and (max-width:1024px) {
    .olinelist .conn h3 { padding-top: 30px; font-size: 24px; line-height: 1.5; }
    .olinelist .conn i { font-size: 14px; }
}

@media only screen and (max-width:768px) {
    .olinelist .conn h3 { padding-top: 20px; font-size: 18px; line-height: 1.5; }
    .olinelist .conn i { font-size: 12px; }
}




#fromemail input[type='text'] { border: solid 1px #d0d0d0; line-height: 26px; height: 30px; width: 100%; padding: 0px 0px 0px 5px; color: #333; }
    #fromemail input[type='text']:focus { border: solid 1px #5286b6; }
#fromemail textarea { border: solid 1px #cccccc; line-height: 26px; height: 100px; width: 100%; padding: 0px 0px 0px 5px; }
#fromemail input[type='button'] { height: 36px; border-radius: 4px; color: #fff; background-color: #830010; border-style: none; cursor: pointer; font-size: 14px; padding: 0px 50px; }
